<template>
  <div class="orderInfo">
    <div class="flex_end">
      <a-button @click="handleBack">返回</a-button>
    </div>
    <div class="orderNumber">
      <p>订单编号：{{ orderDetail.orderNo }}</p>
      <p style="margin-left: 10px">子订单编号：{{ orderDetail.orderGoodsNo }}</p>
      <p style="margin-left: 10px">下单时间：{{ orderDetail.createDate }}</p>
      <p style="margin-left: 10px">订单来源：{{ orderDetail.orderFromType | orderFormType }}</p>
      <p style="margin-left: 10px">订单类型：{{ orderDetail.orderType | orderTypeList }}</p>
      <p style="margin-left: 10px">
        订单状态：
        <span style="color: red;" v-if="returnGoodsStatus=='REFUND_FINISH' && repairsType==1 ">已退款</span>
        <span style="color: red;" v-if="returnGoodsStatus=='REFUND_FINISH' && repairsType==2 ">已退货退款</span>
        <span style="color: red;" v-if="returnGoodsStatus=='TO_AUDIT' ">待审核</span>
        <span style="color: red;" v-if="returnGoodsStatus=='RECEIVED_GOODS' || returnGoodsStatus=='WAITING_GOODS'||returnGoodsStatus=='WAITING_DELIVERY' ">退货中</span>
        <span style="color: red;" v-if="returnGoodsStatus=='REFUND_OF' ">退款中</span>
      </p>
      <p style="margin-left: 10px" v-if="orderDetail.roomId">直播间号：{{ orderDetail.roomId }}</p>
      <p style="margin-left: 10px" v-if="orderDetail.orderChannel">下单渠道：{{ orderDetail.orderChannel | orderChannelList }}</p>
      <p style="margin-left: 10px" v-if="orderDetail.shareManId">分享人Id：{{ orderDetail.shareManId }}</p>
    </div>

    <a-row type="flex" class="transactionProgress">
      <a-col flex="290px" class="transactionleft">
        <p class="transactionTitle">{{ orderDetail.orderStatus | filterOrderStatus }}</p>

        <div class="item_action" v-if="orderDetail.orderStatus == 'ORDER_UNPAID'">
          <a class="link-button" href="javascript:;;" @click="openInfo(orderDetail, 'cancellation')">取消订单</a>
          <a class="link-button" href="javascript:;;" @click="openInfo(orderDetail, 'priceChange')">改价</a>
        </div>
        <!-- 待发货 -->
        <template v-if="orderDetail.goodsDistribution == 0">
          <div class="item_action" v-if="orderDetail.orderStatus == 'ORDER_UN_ISSUE'">
            <p>买家已付款至待结算账户，请尽快发货，否则买家有权申请退款</p>
            <!-- <a
              class="link-button"
              href="javascript:;;"
              @click="openInfo(orderDetail, 'shoppingInfo')"
              >发货</a
            > -->
            <a-button class="link-button" type="primary" style="margin: 15px auto" @click="openInfo(orderDetail, 'shoppingInfo')">发货</a-button>
          </div>
        </template>
        <template v-if="orderDetail.goodsDistribution == 1"></template>
        <!-- 待收货 -->
        <div class="item_action" v-if="orderDetail.orderStatus == 'ORDER_UN_RECEIVED'">
          <p>买家如在7天内 没有申请退款，交易将自动完成</p>
        </div>
        <!-- <p>小额打款：2222</p> -->
        <div class="actions-remark-star">
          <div class="action-remark">
            <a class="link-button" @click="openInfo(orderDetail, 'remarks')">备注</a>
          </div>
        </div>
      </a-col>
      <a-col flex="auto" class="transactionright">
        <!-- 进度条 -->
        <div class="speedProgress">
          <a-steps
            :current="orderStatusStep"
            labelPlacement="vertical"
            size="small"
            v-if="!!orderDetail.orderStatusList &&orderDetail.orderStatusList.length > 0">
            <a-step>
              <span slot="title">买家下单</span>
              <span slot="description" class="time">
                {{orderDetail.orderStatusList[orderDetail.orderStatusList.length - 1]}}</span>
            </a-step>
            <a-step>
              <span slot="title">买家已付款</span>
              <span slot="description" class="time">{{
                orderDetail.orderStatusList[
                  orderDetail.orderStatusList.length - 2
                ]
              }}</span>
            </a-step>
            <a-step
              v-if="(orderDetail.goodsDistribution == 0 ||orderDetail.goodsDistribution == 2) && repairsType!==1">
              <span slot="title">商家已发货</span>
              <span slot="description" class="time">{{
                orderDetail.orderStatusList[
                  orderDetail.orderStatusList.length - 3
                ]
              }}</span>
            </a-step>
            <a-step v-if="orderDetail.goodsDistribution == 1">
              <span slot="title">待自提</span>
              <span slot="description" class="time">{{
                orderDetail.orderStatusList[
                  orderDetail.orderStatusList.length - 3
                ]
              }}</span>
            </a-step>

            <a-step>
              <span slot="title" v-if="returnGoodsStatus=='REFUND_FINISH' ">已关闭</span>
              <span slot="title" v-else>交易完成</span>
              <span slot="description" class="time">{{
                orderDetail.orderStatusList[
                  orderDetail.orderStatusList.length - 4
                ]
              }}</span>
            </a-step>
          </a-steps>
        </div>
      </a-col>
    </a-row>

    <!-- 包裹  已发货 --  已完成状态展示 -->
    <div
      class="packageInfo"
      v-if="
        packageInfos.length > 0 &&
        orderStatusStep >= 2 &&
        (orderDetail.goodsDistribution == 0 ||
          orderDetail.goodsDistribution == 2)
      "
    >
      <a-tabs type="card" style="margin-top: 20px" @change="callback">
        <a-tab-pane
          :key="index + 1"
          :tab="`包裹${index + 1}`"
          v-for="(item, index) in packageInfos"
        >
          <a-row type="flex" class="transactionProgress">
            <a-col flex="290px" class="transactionleft">
              <p>发货方式</p>
              <p>发货时间：{{ item.deliveryTime }}</p>
              <p>
                运单号：{{ item.expressCompanyName }}
                {{ item.expressTrackNumber }}
              </p>
              <div
                style="
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  flex-direction: column;
                "
              >
                <div
                  class="retail-lazyimage-container cover"
                  style="width: 100px; height: 100px"
                >
                  <table-img
                    style="width: 100%; height: 100%"
                    :src="(item.goodsInfo && item.goodsInfo.img) || ''"
                  />
                </div>
                <p>{{ (item.goodsInfo && item.goodsInfo.name) || "" }}</p>
              </div>
            </a-col>

            <a-col
              flex="auto"
              class="transactionright"
              v-if="item.queryTrackMapResp"
            >
              <div v-if="!item.queryTrackMapResp.state">
                物流状态：{{ item.queryTrackMapResp.message }}
              </div>
              <div v-else>
                物流状态：{{ item.queryTrackMapResp.state | filterState }}
              </div>
              <div
                class="packageSpeedProgress"
                v-if="item.queryTrackMapResp.state"
              >
                <a-steps progress-dot :current="0" direction="vertical">
                  <a-step
                    v-for="(item, index) in item.queryTrackMapResp.data"
                    :key="index"
                    :title="item.time"
                    :description="item.context"
                  />
                </a-steps>
              </div>
            </a-col>
          </a-row>
        </a-tab-pane>
      </a-tabs>
    </div>
    <!-- 订单信息描述 -->

    <a-descriptions
      layout="vertical"
      class="describe"
      :colon="false"
      :column="3.5"
    >
      <a-descriptions-item
        v-if="
          orderDetail.goodsDistribution == 0 ||
          orderDetail.goodsDistribution == 2
        "
        :span="1"
      >
        <template slot="label">
          收货人信息
          <a-button type="link" @click="openInfo(orderDetail, 'addressChange')">
            修改
          </a-button>
          <a-button style="margin-left: -20px" type="link" @click="copy">
            复制
          </a-button>
        </template>

        <p>收货人姓名：{{ orderDetail.userName }}</p>
        <p>联系电话：{{ orderDetail.userPhone }}</p>
        <p>
          收货地址：{{ orderDetail.provinceName }}{{ orderDetail.cityName
          }}{{ orderDetail.districtName
          }}{{ orderDetail.streetName ? orderDetail.streetName : ""
          }}{{ orderDetail.detailAddress }}
        </p>
      </a-descriptions-item>
      <a-descriptions-item v-if="orderDetail.goodsDistribution == 1" :span="1">
        <template slot="label">
          自提地址
          <a-button type="link" @click="openInfo(orderDetail, 'addressChange')">
            修改
          </a-button>
          <a-button style="margin-left: -20px" type="link" @click="copy">
            复制
          </a-button>
        </template>

        <p>联系人姓名：{{ orderDetail.userName }}</p>
        <p>联系电话：{{ orderDetail.userPhone }}</p>
        <p>
          收货地址：{{ orderDetail.provinceName }}{{ orderDetail.cityName
          }}{{ orderDetail.districtName }}{{ orderDetail.detailAddress }}
        </p>
      </a-descriptions-item>

      <a-descriptions-item>
        <template slot="label"> 配送信息 </template>
        <p>
          配送方式：{{ orderDetail.goodsDistribution | filterDistribution }}
        </p>
        <p>
          {{ orderDetail.goodsDistribution == 1 ? "自提时间" : "发货时间" }}：{{
            orderDetail.deliveryTime
          }}
        </p>
      </a-descriptions-item>

      <a-descriptions-item>
        <template slot="label"> 同步erp信息 </template>
        <p>
          同步状态:
          <span style="font-weight: bold;" v-if="orderDetail.erpNotifyStatus ==1">成功</span>
          <span style="font-weight: bold;" v-if="orderDetail.erpNotifyStatus ==0">失败</span>
        </p>


        <p>es单号:{{orderDetail.erpOrderNo }}</p>
        <p v-show="!!orderDetail.erpNotifyMsg" style="color: red;">错误信息:{{orderDetail.erpNotifyMsg}}</p>
        <a-button @click="tongbuERP" type="primary" v-show="orderDetail.erpNotifyStatus!=1" >手动同步至ERP</a-button>
      </a-descriptions-item>

      <a-descriptions-item>
        <template slot="label"> 付款信息 </template>
        <p v-if="orderStatusStep == 0">待付款</p>
        <template v-if="orderStatusStep >= 1">
          <p v-if="orderDetail.paymentWay==0 || orderDetail.paymentWay==1 || orderDetail.paymentWay == null">商品金额：￥ {{ orderDetail.goodsPrice | filterPrice }}</p>
          <p v-else-if="orderDetail.paymentWay==2">商品金额：￥ {{ orderDetail.goodsPrice | filterPrice }}+{{ orderDetail.integralPrice }}固定积分</p>
          <p v-else-if="orderDetail.paymentWay==3">商品金额：{{ orderDetail.integralPrice }}积分</p>
          <p>改价：￥{{ orderDetail.changePrice | filterPrice }}</p>
          <p>优惠：￥{{ orderDetail.discountPrice | filterPrice }}</p>
          <p v-if="orderDetail.paymentWay==0 || orderDetail.paymentWay==1 || orderDetail.paymentWay == null">实付金额：￥ {{ orderDetail.goodsOrderPrice | filterPrice }}</p>
          <p v-else-if="orderDetail.paymentWay==2">实付金额：￥ {{ orderDetail.goodsOrderPrice | filterPrice }}+{{ orderDetail.integralPrice }}固定积分</p>
          <p v-else-if="orderDetail.paymentWay==3">实付金额：{{ orderDetail.integralPrice }}积分</p>
          <p>支付方式：{{ orderDetail.orderPayType | filterOrderPayType }}</p>
          <p>付款时间：{{ orderDetail.orderPayTime }}</p>
        </template>
      </a-descriptions-item>
      <a-descriptions-item>
        <template slot="label">买家信息</template>
        <p>买家电话：<a-button type="link"  @click="toClientDetailPage">{{ orderDetail.customerPhone }}</a-button></p>
        <p>买家留言：-</p>
      </a-descriptions-item>
    </a-descriptions>
    <!-- 商品 -->

    <a-table
      :columns="columns"
      rowKey="id"
      :data-source="[orderDetail]"
      bordered
      :pagination="false"
      style="margin-top: 20px"
    >
    </a-table>

    <div class="tableFooter">
      <p v-if="orderDetail.paymentWay==0 || orderDetail.paymentWay==1 || orderDetail.paymentWay == null">商品金额：￥ {{ orderDetail.goodsSumPrice | filterPrice }}</p>
      <p v-else-if="orderDetail.paymentWay==2">商品金额：￥ {{ orderDetail.goodsSumPrice | filterPrice }}+{{ orderDetail.integralPrice }}固定积分</p>
      <p v-else-if="orderDetail.paymentWay==3">商品金额：{{ orderDetail.integralPrice }}积分</p>
      <p>配送方式：{{ orderDetail.goodsDistribution | filterDistribution }}</p>
      <p>运费：{{ orderDetail.freightPrice | filterPrice }}</p>
      <p>优惠：{{ orderDetail.discountPrice | filterPrice }}</p>
      <p>支付方式：{{ orderDetail.orderPayType | filterOrderPayType }}</p>
      <p v-if="orderDetail.paymentWay==0 || orderDetail.paymentWay==1 || orderDetail.paymentWay == null">实收金额： <span style="color: red" >¥ {{ orderDetail.goodsOrderPrice | filterPrice }}</span></p>
      <p v-else-if="orderDetail.paymentWay==2">实收金额： <span style="color: red" >¥ {{ orderDetail.goodsOrderPrice | filterPrice }}</span>+<span style="color: red" >{{ orderDetail.integralPrice }}固定积分</span></p>
      <p v-else-if="orderDetail.paymentWay==3">实收金额：<span style="color: red" >{{ orderDetail.integralPrice }}积分</span></p>
    </div>

    <a-row v-if="invoiceData">
      <a-col style="font-size: 14px; font-weight: bold; text-indent: 1em;">发票信息</a-col>
    </a-row>
    <a-table
      v-if="invoiceData"
      :columns="invoiceColumns"
      rowKey="id"
      :data-source="[invoiceData]"
      bordered
      :pagination="false"
      style="margin-top: 20px">
      <template slot="operation" slot-scope="text, record">
        <a-space>
          <span class="text-primary pointer" @click="openInvoiceInfo(record, record.modify ? 'edit' : 'view')">{{ record.modify ? '修改' : '查看' }}</span>
        </a-space>
      </template>
    </a-table>

    <!-- 弹窗 -->
    <!-- 新增备注 -->
    <add-remarks
      v-model="remarkShow"
      @handleSubmit="handleSubmit('remarks')"
      :records="orderDetail"
    />
    <!-- 取消订单 -->
    <cancellation-order
      v-model="cancellationShow"
      @handleSubmit="handleSubmit('cancellation')"
      :records="orderDetail"
    />
    <!-- 发货 -->
    <shipping-info
      v-model="shoppingInfoShow"
      @handleSubmit="handleSubmit('shoppingInfo')"
      :records="orderDetail"
    />
    <!-- 改价 -->
    <price-change
      v-model="priceChangeShow"
      @handleSubmit="handleSubmit('priceChange')"
      :records="orderDetail"
    />
    <!-- 修改地址 -->
    <address-change
      :record="orderDetail"
      @cancel="closeInfoModal"
      :visible="infoVisible"
    />
    <!-- 修改发票信息 -->
    <InvoiceInfo
      :record="invoiceData"
      @cancel="closeInfoModal"
      :visible="invoiceInfoVisible"
    />

  </div>
</template>

<script>
import AddRemarks from "./components/AddRemarks";
import CancellationOrder from "./components/CancellationOrder";
import ShippingInfo from "./components/ShippingInfo";
import PriceChange from "./components/PriceChange";
import AddressChange from "./components/AddressChange";
import InvoiceInfo from "./components/InvoiceInfo";
export default {
  name: "",
  data() {
    return {
      packageInfos: [], //
      orderStatusStep: -1, // 当前订单状态值
      orderDetail: {},
      remarkShow: false,
      cancellationShow: false,
      shoppingInfoShow: false,
      priceChangeShow: false,
      infoVisible: false,
      invoiceInfoVisible: false,

      data: [],
      data2: [],
      cityOptions: [],
      totalPrice: 0, // 总金额
      columns: [
        {
          title: "商品",
          dataIndex: "name",
          key: "name",
          customRender: (text, row) => {
            let img = row.goodsImg ? row.goodsImg.split(",")[0] : "";
            let obj = {}
            if(row.productType == 3) {
              obj = {
                children: (
                  <div class="table-goods">
                    <table-img class="goods_img" src={img} />
                    <div class="rc-goods-cell-right">
                      <div class="rc-goods-cell-name">
                        <a href="javascript:;;" class="rc-blank-link" rel="noopener noreferrer">
                          {row.goodsName}
                        </a>
                      </div>
                      <div class="rc-goods-cell-info rc-goods-cell-info-spec">
                        {row.skuName}
                      </div>
                      <div class="rc-goods-cell-info rc-goods-cell-info-no">
                        {row.goodsCode}
                      </div>
                      <div class="rc-goods-cell-info rc-goods-cell-info-no">
                        {row.giftName}
                      </div>
                      <div v-show={row.givingName} class="rc-goods-cell-info rc-goods-cell-info-no">
                        赠品：{row.givingName}
                      </div>
                    </div>
                  </div>
                ),
                attrs: {},
              }
            } else {
              obj = {
                children: (
                  <div class="table-goods">
                    <table-img class="goods_img" src={img} />
                    <div class="rc-goods-cell-right">
                      <div class="rc-goods-cell-name">
                        <a href="javascript:;;" class="rc-blank-link" rel="noopener noreferrer">
                          {row.goodsName}
                        </a>
                      </div>
                      <div class="rc-goods-cell-info rc-goods-cell-info-spec">
                        {row.skuName}
                      </div>
                      <div class="rc-goods-cell-info rc-goods-cell-info-no">
                        {row.goodsCode}
                      </div>
                      <div v-show={row.givingName} class="rc-goods-cell-info rc-goods-cell-info-no">
                        赠品：{row.givingName}
                      </div>
                    </div>
                  </div>
                ),
                attrs: {},
              }
            }

            return obj;
          },
        },
        {
          title: "单价（元）/数量",
          dataIndex: "moneyAndNum",
          key: "moneyAndNum",
          customRender: (text, row) => {
            let obj = {}
            if(row.paymentWay==0 || row.paymentWay==1 || row.paymentWay == null) {
              obj = {
                children: (
                  <div class="table_item">
                    <span class="item-price">
                      ¥ {(row.goodsPrice ? (+row.goodsPrice / 100).toFixed(2) : '0.00')}
                    </span>
                    <span class="item-unit">{row.goodsNum}件</span>
                  </div>
                ),
                attrs: {},
              }
            } else if(row.paymentWay==2) {
              obj = {
                children: (
                  <div class="table_item">
                    <span class="item-price">
                      ¥ {(row.goodsPrice ? (+row.goodsPrice / 100).toFixed(2) : '0.00')}+{ row.integralPrice }固定积分
                    </span>
                    <span class="item-unit">{row.goodsNum}件</span>
                  </div>
                ),
                attrs: {},
              }
            } else if(row.paymentWay==3) {
              obj = {
                children: (
                  <div class="table_item">
                    <span class="item-price">
                      { row.integralPrice }积分
                    </span>
                    <span class="item-unit">{row.goodsNum}件</span>
                  </div>
                ),
                attrs: {},
              }
            }

            /*  return <div className="table_item">
                  <span className="item-price">
                    {(+row.goodsPrice / 100).toFixed(2)}
                  </span>
              <span className="item-unit">{row.goodsNum}件</span>
            </div>;*/
            return obj;
          },
        },
        {
          title: "小计（元）",
          dataIndex: "goodsOrderPrice",
          key: "goodsOrderPrice",
          customRender: (text, row) => {
            let res = ''
            if(row.paymentWay==0 || row.paymentWay==1 || row.paymentWay == null) {
              res = text ? `¥ ${(+text / 100).toFixed(2)}` : '¥ 0.00'
            } else if(row.paymentWay==2) {
              res = (text ? `¥ ${(+text / 100).toFixed(2)}` : '¥ 0.00')+'+'+row.integralPrice+'固定积分'
            } else if(row.paymentWay==3) {
              res = row.integralPrice+'积分'
            }
            return res;
          },
        },
        {
          title: "发货状态",
          dataIndex: "orderGoodsSendStatus",
          key: "orderGoodsSendStatus",
          customRender: (text, row) => {
            if (text == 1) {
              return "已发货";
            }
            return "未发货";
          },
        },
        {
          title: "优惠（元）",
          dataIndex: "discountPrice",
          key: "discountPrice",
          customRender: (text, row) => {
            if (!!text) {
              return `${(+text / 100).toFixed(2)}`;
            }
            return "0.00";
          },
        },
        {
          title: "实付",
          dataIndex: "goodsOrderPrice",
          key: "goodsOrderPrice1",
          customRender: (text, row) => {
            let res = ''
            if(row.paymentWay==0 || row.paymentWay==1 || row.paymentWay == null) {
              res = row.goodsOrderPrice ? `¥ ${(+row.goodsOrderPrice / 100).toFixed(2)}` : '¥ 0.00'
            } else if(row.paymentWay==2) {
              res = (row.goodsOrderPrice ? `¥ ${(+row.goodsOrderPrice / 100).toFixed(2)}` : '¥ 0.00')+'+'+row.integralPrice+'固定积分'
            } else if(row.paymentWay==3) {
              res = row.integralPrice+'积分'
            }
            return res;
          },
        },
      ],
      // 发票表格
      invoiceColumns: [
        {
          title: "发票类型",
          dataIndex: "invoiceType",
          key: "invoiceType",
          align: 'center',
          customRender: (text) => {
            return '电子普通发票';
          },
        },
        {
          title: "抬头类型",
          dataIndex: "headType",
          key: "headType",
          align: 'center',
          customRender: (text) => {
            let res = ''
            if (text == 1) {
              res = "企业";
            } else if (text == 2) {
              res = "个人";
            }
            return res;
          },
        },
        {
          title: "发票内容",
          dataIndex: "content",
          key: "content",
          align: 'center',
          customRender: (text) => {
            let res = ''
            if (text == 1) {
              res = "商品类别";
            } else if (text == 2) {
              res = "商品详情";
            }
            return res;
          },
        },
        {
          title: "抬头名称",
          dataIndex: "buyerName",
          key: "buyerName",
          align: 'center',
        },
        {
          title: "公司税号",
          dataIndex: "buyerTaxNum",
          key: "buyerTaxNum",
          align: 'center',
        },
        {
          title: "企业电话",
          dataIndex: "buyerTel",
          key: "buyerTel",
          align: 'center',
        },
        {
          title: "收票人邮箱",
          dataIndex: "email",
          key: "email",
          align: 'center',
        },
        {
          title: "操作",
          dataIndex: "handle",
          key: "handle",
          align: 'center',
          scopedSlots: { customRender: "operation" },
        },
      ],
      // 发票数据
      invoiceData: {},
      isReload: false,

      returnGoodsStatus:'',
      repairsType:null,
    };
  },
  computed: {
    id() {
      return this.$route.query.id;
    },
    groupId() {
      return this.$route.query.groupId;
    },
    source() {
      return this.$route.query.source;
    },
  },
  filters: {
    filterPrice(value) {
      if (!value) return "0.00";
      return `${(value / 100).toFixed(2)}`;
    },

    filterOrderStatus(value) {
      switch (value) {
        case "ORDER_UNPAID":
          return "等待买家付款";
        case "ORDER_CANCEL":
          return "订单已取消"; // 已取消
        case "ORDER_UN_ISSUE":
          return "等待商家发货"; // 待发货
        case "ORDER_LEFT_WAIT":
          return "等待买家自提"; // 已取消
        case "ORDER_UN_RECEIVED":
          return "等待买家确认收货"; // 待收货
        case "ORDER_UN_EVALUATE":
          return "等待买家评价"; // 待评价
        case "ORDER_FINISH":
          return "交易成功"; // 已完成
      }
    },

    filterDistribution(val) {
      if (val == 1) {
        return "定点自提";
      } else if (val == 2) {
        return "物流配送";
      }
      return "物流配送";
    },

    // 银行卡2   微信支付1
    filterOrderPayType(val) {
      if (val == 2) {
        return "国际银行支付";
      }
      return "微信支付";
    },

    /*
     *0在途，1揽收，2疑难，3签收，4退签，5派件，6退回，7转投，10待清关，11清关中，12已清关，13清关异常，14拒签
     */
    filterState(value) {
      switch (value) {
        case "0":
          return "在途";
        case "1":
          return "揽收"; //
        case "2":
          return "疑难"; //
        case "3":
          return "签收"; //
        case "4":
          return "退签"; //
        case "5":
          return "派件"; //
        case "6":
          return "退回"; //
        case "7":
          return "转投"; //
        case "10":
          return "待清关"; //
        case "11":
          return "清关中"; //
        case "12":
          return "已清关"; //
        case "13":
          return "清关异常"; //
        case "14":
          return "拒签"; //
        default:
          return "暂无";
      }
    },
    orderTypeList(value) {
      switch (value) {
        case "GOODS_ORDER":
          return "普通订单";
        case "GROUP_ORDER":
          return "团购订单";
        case "SECKILL_ORDER":
          return "秒杀订单";
        case "ROOM_ORDER":
          return "直播间订单";
        default:
          return "普通订单";
      }
    },
    orderChannelList(value) {
      switch (value) {
        case 1:
          return "分销员分享";
        case 2:
          return "普通会员分享";
        case 3:
          return "主播分享";
        case 4:
          return "普通订单";
        default:
          return "普通订单";
      }
    },
    orderFormType(value) {
      switch (value) {
        case 1:
          return "金桔有品";
        // return "微信小程序";
        case 2:
          return "金牌厨柜官方号";
        default:
          return "金桔有品";
        // return "微信小程序";
      }
    },
  },

  components: {
    AddRemarks,
    CancellationOrder,
    ShippingInfo,
    PriceChange,
    AddressChange,
    InvoiceInfo
  },
  watch: {},
  beforeCreate() {},
  created() {
    // console.log(this.$route.query, "参数");
    this.returnGoodsStatus = this.$route.query.returnGoodsStatus || null
    this.repairsType = this.$route.query.repairsType || null
    this.getOrderDetail();
    // this.getExpressInfo();
    console.log("this.$store", this.$store);
    //this.$store.dispatch('setIsUpdate',false);
  },
  beforeMount() {},
  mounted() {},
  beforeUpdate() {},
  updated() {},
  activated() {},
  deactivated() {},
  beforeDestroy() {},
  destroyed() {},
  // 方法集合
  methods: {
    handleBack() {
      if (this.source == "group") {
        this.$router.push({
          name: "OrderGroupBargainingPagesInfo",
          query: {
            id: this.groupId,
          },
        });
      } else {
        this.$router.push({
          name: "OrderList",
          query: {
            back: !this.isReload,
          },
        });
      }
    },
    closeInfoModal(freshTable) {
      this.infoVisible = false;
      this.invoiceInfoVisible = false;
      if (freshTable) {
        this.isReload = true;
        //this.$store.dispatch('setIsUpdate',true);
        //this.$refs.searchtable.refreshTable();
        this.getOrderDetail();
      }
    },

    // /复制
    copy() {
      //创建input标签
      var input = document.createElement("input");
      //将input的值设置为需要复制的内容
      input.value = `${this.orderDetail.userName} ${this.orderDetail.userPhone} ${this.orderDetail.provinceName} ${this.orderDetail.cityName} ${this.orderDetail.districtName} ${this.orderDetail.detailAddress}`;
      //添加input标签
      document.body.appendChild(input);
      //选中input标签
      input.select();
      //执行复制
      document.execCommand("copy");
      //成功提示信息
      this.$message.success("复制成功!");
      //移除input标签
      document.body.removeChild(input);
    },

    /*changeNumToHan(num) {
      var arr1 = new Array(
        "零",
        "一",
        "二",
        "三",
        "四",
        "五",
        "六",
        "七",
        "八",
        "九"
      );
      var arr2 = new Array(
        "",
        "十",
        "百",
        "千",
        "万",
        "十",
        "百",
        "千",
        "亿",
        "十",
        "百",
        "千",
        "万",
        "十",
        "百",
        "千",
        "亿"
      ); //可继续追加更高位转换值
      if (!num || isNaN(num)) {
        return "零";
      }
      var english = num.toString().split("");
      var result = "";
      for (var i = 0; i < english.length; i++) {
        var des_i = english.length - 1 - i; //倒序排列设值
        result = arr2[i] + result;
        var arr1_index = english[des_i];
        result = arr1[arr1_index] + result;
      }
      //将【零千、零百】换成【零】 【十零】换成【十】
      result = result.replace(/零(千|百|十)/g, "零").replace(/十零/g, "十");
      //合并中间多个零为一个零
      result = result.replace(/零+/g, "零");
      //将【零亿】换成【亿】【零万】换成【万】
      result = result.replace(/零亿/g, "亿").replace(/零万/g, "万");
      //将【亿万】换成【亿】
      result = result.replace(/亿万/g, "亿");
      //移除末尾的零
      result = result.replace(/零+$/, "");
      //将【零一十】换成【零十】
      //result = result.replace(/零一十/g, '零十');//貌似正规读法是零一十
      //将【一十】换成【十】
      result = result.replace(/^一十/g, "十");
      return result;
    },*/

    getOrderDetail() {
      console.log(this.id);
      // 获取订单详情
      this.$get("/order/goods/query", {
        id: this.id,
      }).then((res) => {
        if (res && res.returnCode === 1000) {
          console.log("订单详情:", res);
          this.orderDetail = res.dataInfo;
          console.log("orderDetail订单详情", this.orderDetail);
          let goodsOrderPrice = +this.orderDetail.goodsOrderPrice;
          let freight = this.orderDetail.freightPrice
            ? +this.orderDetail.freightPrice
            : 0;
          let couponAmount = this.orderDetail.couponAmount
            ? this.orderDetail.couponAmount
            : 0;
          this.totalPrice = goodsOrderPrice + freight - couponAmount;
          console.log(this.totalPrice, "totalPrice");
          if (this.orderDetail.orderStatus != "ORDER_CANCEL") {
            // 已取消
            this.orderStatusStep = this.handleOrderStatus(
              this.orderDetail.orderStatus
            );
          }

          if (
            this.orderStatusStep >= 2 ||
            this.orderDetail.orderStatus === "ORDER_UN_RECEIVED" ||
            this.orderDetail.orderStatus === "ORDER_UN_EVALUATE" ||
            this.orderDetail.orderStatus === "ORDER_FINISH"
          ) {
            this.getExpressInfo();
          }

          this.getInvoiceInfo(res.dataInfo.orderId, this.id)
        }
      });
    },
    // 获取包裹信息
    getExpressInfo() {
      console.log("包裹ID:", this.id);

      this.$get("/order/express/package/info", {
        goodsOrderId: this.id,
      }).then((res) => {
        if (res && res.returnCode === 1000) {
          console.log("包裹信息", res);
          this.packageInfos = [res.dataInfo];
        } else {
          return;
        }
      });
    },
    // 获取发票信息
    getInvoiceInfo(orderId, orderGoodsId) {
      this.$get(
        "/order/invoice/query",
        {
          orderId: orderId,
          orderGoodsId: orderGoodsId
        },
        { baseURL: `${location.origin}/goldenhome/invoice/admin` }
      ).then((res) => {
        if (res && res.returnCode === 1000) {
          this.invoiceData = res.dataInfo;
        } else {
          return;
        }
      });
    },
    // 打开发票信息
    openInvoiceInfo(record, handle) {
      if(handle == 'edit') {
        console.log('edit', record)
        this.invoiceInfoVisible = true
      } else if(handle == 'view') {
        console.log('view')
        if(record.invoiceImage) {
          this.$info({
            title: '发票',
            okText: '关闭',
            closable: true,
            maskClosable: true,
            width: 'fit-content',
            content: <img src={record.invoiceImage} onClick={() => window.open(record.invoiceImage)} style="max-width: 600px; max-height: 400px" />
          })
          // window.open('https://'+record.invoiceImage)
        } else if(record.failCause) {
          this.$message.error(record.failCause);
        }
      }
    },

    callback(key) {
      console.log(key);
    },

    handleOrderStatus(value) {
      switch (value) {
        case "ORDER_UNPAID":
          return 0; // 待付款
        case "ORDER_UN_ISSUE":
          return 1; // 待发货
        case "ORDER_UN_RECEIVED":
          return 2; // 待收货
        case "ORDER_UN_EVALUATE":
          return 3; // 待评价
        case "ORDER_FINISH":
          return 3; // 已完成

        default:
          return 0; // 已完成
      }
    },

    // 打开相对应的弹窗
    openInfo(record, type) {
      this.currentRecord = record;
      if (type == "remarks") {
        this.remarkShow = true;
      } else if (type == "cancellation") {
        this.cancellationShow = true;
      } else if (type == "shoppingInfo") {
        console.log("laile");
        this.shoppingInfoShow = true;
      } else if (type == "priceChange") {
        console.log("priceChange");
        this.priceChangeShow = true;
      } else if (type == "addressChange") {
        this.infoVisible = true;
      }
    },

    handleSubmit(type) {
      //this.$store.dispatch('setIsUpdate',true);
      this.isReload = true;
      if (type == "remarks") {
        this.remarkShow = false;
      } else if (type == "cancellation") {
        this.cancellationShow = false;
      } else if (type == "shoppingInfo") {
        this.shoppingInfoShow = false;
      } else if (type == "priceChange") {
        this.priceChangeShow = false;
      }
      this.getOrderDetail();
    },


    toClientDetailPage(record) {
      // this.currentRecord = record;
   /*   this.$router.push({
        name: "CustomerUserInfo",
        query: {
          id: this.orderDetail.userId,
        },
      });*/

      let routes = this.$router.resolve({ name: "CustomerUserInfo", query: { id: this.orderDetail.userId,source:'order'} });
      window.open(routes.href, "_blank");

      /*    console.log(`${ location.origin+location.pathname  }`)
            var a = document.createElement('a');
            a.setAttribute('href', `${location.origin+location.pathname}/#/customer/userInfo?id=${this.orderDetail.userId}`);
            a.setAttribute('target', '_blank');
            // a.setAttribute('target', '_blank');
            document.body.appendChild(a);
            a.click();*/
    },

    tongbuERP(){
      console.log("同步至erp");
      // /admin/order/goods/erpNotify
      console.log(typeof this.orderDetail.id);
      // 子订单 数组
      let shuzu = []
      shuzu.push(this.orderDetail.id)
      this.$post("/order/goods/erpNotify", shuzu).then((res) => {
        if (res && res.returnCode === 1000) {
          this.$message.success("同步成功")
        }
      });
    }
  },
};
</script>
<style rel='stylesheet/less' lang='less' scoped>
//@import url();

.flex_end {
  display: flex;
  justify-content: flex-end;
}
.orderInfo {
  .orderNumber {
    display: flex;
    margin-bottom: 14px;
  }
  .link-button {
    display: block;
    margin-bottom: 5px;
  }
  /deep/.ant-descriptions-item-content p {
    margin-bottom: 10px;
  }

  .transactionProgress {
    border: 1px solid #eee;
    border-top: none;
    min-height: 100px;
    .transactionleft,
    .transactionright {
      padding: 10px;
      display: inline-block;
    }
    .transactionleft {
      border-right: 1px solid #eee;
      .transactionTitle {
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 1px;
        margin-bottom: 20px;
      }
    }
    .transactionright {
      .time {
        font-size: 12px;
      }
    }
  }
  .describe {
    background: rgb(247, 247, 247);
    margin-top: 20px;
    padding: 10px;
    .updata {
      margin: 0 10px;
    }
    .info {
      font-size: 14px;
      line-height: 18px;
    }
  }
  .table-goods {
    // max-width: 200px;
    min-width: 100px;
    display: flex;
    .goods_img {
      width: 60px;
      height: 60px;
      flex: 0 0 auto;
      margin-right: 10px;
    }
    .rc-goods-cell-right {
      flex-grow: 1;
      padding: 4px 0;
      .rc-goods-cell-name {
        color: #323232;
        font-size: 14px;
        line-height: 18px;
        word-break: break-all;
      }
      .rc-goods-cell-info {
        margin-top: 2px;
        word-break: break-all;
        font-size: 12px;
        color: #969799;
      }
    }
  }
  .table_item {
    .item-price {
      display: block;
    }
    .item-unit {
      display: block;
    }
  }
  .tableFooter {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin: 14px 0;
    p {
      width: 100%;
      padding-left: 82%;
      // line-height: 18px;
    }
    p:nth-last-child(1) {
      font-weight: 600;
      margin-top: 18px;
    }
  }
  .info-title {
    font-size: 14px;
    height: 40px;
    background: #f5f5f5;
    border-radius: 4px;
    line-height: 40px;
    padding-left: 30px;
    position: relative;
    margin: 20px 0;

    &::before {
      content: "";
      display: inline-block;
      width: 3px;
      height: 16px;
      background: #016bff;
      border-radius: 2px;
      position: absolute;
      top: 12px;
      left: 20px;
    }
    &.title2,
    &.title3 {
      margin-top: 30px;
    }
  }
  .speedProgress {
    /deep/ .ant-steps-label-vertical .ant-steps-item-content {
      width: 150px !important;
    }
    /deep/
      .ant-steps-dot
      .ant-steps-item
      .ant-steps-small
      .ant-steps-item-content {
      width: 317px !important;
    }
  }
  .packageSpeedProgress {
    padding: 10px;
    height: 300px;
    overflow: auto;
    /deep/ .ant-steps-dot .ant-steps-item .ant-steps-item-content {
      width: 317px !important;
    }
    /deep/
      .ant-steps-dot
      .ant-steps-item
      .ant-steps-small
      .ant-steps-item-content {
      width: 317px !important;
    }
    /deep/.ant-steps-item-finish
      .ant-steps-item-icon
      > .ant-steps-icon
      .ant-steps-icon-dot {
      background: #b8b8b8;
    }
    /deep/.ant-steps-item-finish
      > .ant-steps-item-container
      > .ant-steps-item-tail::after {
      background: #b8b8b8;
    }
    /deep/.ant-steps-item-process
      .ant-steps-item-icon
      > .ant-steps-icon
      .ant-steps-icon-dot {
      background: #ffb254;
    }
  }
}
  /deep/ .ant-descriptions-item{
    width: 200px;
  }
</style>
